<div>
    <div class="right-conbox" ng-controller="louController">

        <div class="content-box">
            <div class="conBox-left" ng-style="{'background-image':(louData && louData.background && louData.background!=='') ? 'url('+ serviceHttp + louData.background + ')' : 'url(image/lougai.png)','background-size':'100%,100%'}">
                <ul>
                    <li ng-repeat="current_lou in louList">
                        <a hover href="javascript:void(0)"
                           ng-click="redirect('ceng_distribute.html/' + current_lou.id + '/' + current_lou.name)">
                            <img src="image/lou.png" class="IniconStyle" ng-style="{'left':current_lou.xpoint+'px','top':current_lou.ypoint+'px'}"   style="display:inline-block;" >
                        </a>
                        <div class="previewContent">
                            <table class="hover-box-style">
                                <tr class="bott-style XF_colorstyle">
                                    <td>楼名称：</td>
                                    <td></td>
                                    <!--<td>{{current_lou.xpoint+'—'+current_lou.ypoint}}</td>-->
                                    <td>{{current_lou.name}}</td>
                                </tr>
                                <tr class="bott-style XF_colorstyle">
                                    <td>运行天数：</td>
                                    <td></td>
                                    <td>{{current_lou && current_lou.days ? current_lou.days : 0}}</td>
                                </tr>
                                <tr class="bott-style XF_colorstyle">
                                    <td>资产健康值：</td>
                                    <td></td>
                                    <td>{{current_lou && current_lou.score ? current_lou.score.toFixed(0):0}}</td>
                                </tr>
                                <tr class="XF_colorstyle">
                                    <td>设备数量：</td>
                                    <td></td>
                                    <td>{{current_lou && current_lou.total ? current_lou.total : 0}}</td>
                                </tr>
                                <tr>
                                    <td><span>online({{current_lou && current_lou.online ? ( current_lou.online == 0 || current_lou.totle == 0) ? 0 : ((current_lou.online/current_lou.total)*100 ).toFixed(2): 0}}%)</span></td>
                                    <td>
                                        <div class="progress">
                                            <div ng-class="['progress-bar', vm.procssOnlineStyle]"
                                                 ng-style="{width: (current_lou.online ==0 || current_lou.total ==0 ) ? 0 : ((current_lou.online/current_lou.total)*100 ).toFixed(2) + '%'}">
                                           </div>
                                        </div>
                                    </td>
                                    <td>{{current_lou && current_lou.online ? current_lou.online:0}}</td>
                                </tr>
                                <tr class="bott-style">
                                    <td><span>offline({{current_lou && current_lou.offline?(current_lou.offline ==0 || current_lou.total == 0)?0:((current_lou.offline/current_lou.total)*100 ).toFixed(2): 0}}%)</span></td>
                                    <td>
                                        <div class="progress">
                                            <div ng-class="['progress-bar', vm.procssOfflineStyle]"
                                                 ng-style="{width: (current_lou.offline == 0 || current_lou.total == 0) ? 0 : (current_lou.offline/current_lou.total == NaN ? 0 : (current_lou.offline/current_lou.total)*100).toFixed(2) + '%'}">
                                            </div>
                                        </div>
                                    </td>
                                    <td>{{current_lou && current_lou.offline ? current_lou.offline:0}}</td>
                                </tr>
                                <tr class="XF_colorstyle">
                                    <td>报警数量：</td>
                                    <td></td>
                                    <td>{{current_lou.lowAlert + current_lou.highAlert}}</td>
                                </tr>
                                <tr>
                                    <td><span class="yellowWaringColor">黄色报警</span></td>
                                    <td>
                                        <div class="progress">
                                                <div ng-class="['progress-bar', vm.procssYellowStyle]"
                                                     ng-style="{width: (current_lou.lowAlert==0 || current_lou.total==0) ? 0 : ((current_lou.lowAlert/current_lou.total)*100).toFixed(2) + '%'}">
                                                </div>
                                        </div>
                                    </td>
                                    <td>{{current_lou && current_lou.lowAlert ? current_lou.lowAlert : 0}}</td>
                                </tr>
                                <tr>
                                    <td><span class="redWaringColor">红色报警</span></td>
                                    <td>
                                        <div class="progress">
                                            <div ng-class="['progress-bar', vm.procssRedStyle]"
                                                 ng-style="{width: (current_lou.highAlert==0 || current_lou.total==0) ? 0 :((current_lou.highAlert/current_lou.total)*100).toFixed(2) + '%'}">
                                            </div>
                                        </div>
                                    </td>
                                    <td>{{current_lou && current_lou.highAlert ?current_lou.highAlert : 0}}</td>
                                </tr>
                            </table>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="Inparams-box">
                <div class="Inparams-jkz fl">
                    <div class="Inparams-moudel-style mb15">
                        <span class="Inparams-moudel-title">运行天数</span>
                        <span class="Inparams-moudel-value">{{louData && louData.days ? louData.days : 0}}天</span>
                    </div>
                    <div class="Inparams-moudel-style">
                        <span class="Inparams-moudel-title">资产健康值</span>
                        <span class="Inparams-moudel-value">{{louData && louData.score ? louData.score.toFixed(0) : 0}}分</span>
                    </div>
                </div>

                <div class="Inparams-chart fl">
                    <div id="canvasUnitPir" style="width: 255px; height: 180px; "></div>
                </div>

                <div class="Inparams-chart fl">
                    <div id="canvasWaringPir" style="width: 255px; height: 180px; "></div>
                </div>
                <div class="clearfloat"></div>
            </div>
        </div>

    </div>
</div>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script>
    layer.tips($(".previewContent").content);
</script>

